import React, {Component} from 'react';
import {Modal, Space} from "antd"
import {
    apiConsolidatedOrdersPage
} from "@/request/lotteryTools";
import ThePagination from '@/components/ThePagination';
import TheQueryForm from '@/components/TheQueryForm';
import TheTable from '@/components/TheTable';
import TheButton from '@/components/TheButton';

const {confirm} = Modal;

class MergeRecord extends Component {
    constructor(props) {
        super(props);
        this.state = {
            columns: [
                {
                    title: "编号",
                    dataIndex: "mergeGroupsId",
                    key: "mergeGroupsId",
                },
                {
                    title: "总订单",
                    dataIndex: "totalOrderQuantity",
                    key: "totalOrderQuantity",
                },
                {
                    title: "已推送",
                    dataIndex: "pushedOrderQuantity",
                    key: "pushedOrderQuantity",
                },
                {
                    title: "未推送",
                    dataIndex: "unPushedOrderQuantity",
                    key: "unPushedOrderQuantity",
                },
                {
                    title: "合并时间",
                    dataIndex: "MergeTime",
                    key: "MergeTime",
                },
                {
                    title: "状态",
                    dataIndex: "status",
                    key: "status",
                    render: (text, record) => {
                        let label = ""
                        switch (text) {
                            case 0:
                                label = '未推送'
                                break;
                            case 1:
                                label = '部分推送'
                                break;
                            case 2:
                                label = '已推送'
                                break;
                            default:
                                break;
                        }
                        return label
                    }
                },
                {
                    title: "操作",
                    fixed: "right",
                    // width: 300,
                    render: (text, record) => {
                        return (
                            <TheButton
                                haspermi={['winningRecord:mergeRecord:details']}
                                onClick={() => this.toView(record.mergeGroupsId)}
                            >
                                详情
                            </TheButton>
                        );
                    },
                },
            ],
            dataSource: [],
            pageData: {pageNo: 1, pageSize: 10},
            total: 0,
            queryForm: {},
            searchOption: [
                {
                    field: 'status',
                    label: '状态',
                    placeholder: '请选择',
                    required: false,
                    rules: [],
                    type: 'Select',
                    options: [
                        {value: '', label: '全部'},
                        {value: "1", label: '部分推送'},
                        {value: "0", label: '未推送'},
                        {value: "2", label: '已推送'}
                    ],
                    defaultValue: ''
                },
            ],
        }
    }

    componentDidMount() {
        this.getData()
    }

    getData = () => {
        let {pageNo, pageSize} = this.state.pageData;
        let {queryForm} = this.state;
        apiConsolidatedOrdersPage({
            pageNo, pageSize, ...queryForm
        }).then(res => {
            if (res.code === 0) {
                this.setState({
                    dataSource: res.data,
                    total: res.totalCount
                })
            }
        })

    }
    pageChange = (pageNo, pageSize) => {
        this.setState({
            pageData: {
                pageNo,
                pageSize
            }
        }, () => this.getData())
    }

    onReset() {
        this.setState({
            queryForm: {}
        }, () => {
            this.pageChange(1, 10)
        })
    }

    onFormSearch(values) {
        this.setState({
            queryForm: values,
            pageData: {pageNo: 1, pageSize: this.state.pageData.pageSize}
        }, () => {
            this.getData()
        })
    }

    toView = (id) => {
        this.props.history.push(`/lotteryTools/winningRecord/details/${id}`)
    }

    render() {
        const {columns, dataSource, pageData: {pageNo, pageSize}, total, searchOption} = this.state;

        return (
            <div className='p-layout-box'>
                <TheQueryForm ref={(ref) => (this.queryFormRef = ref)} show={true} option={searchOption}
                              onReset={() => this.onReset()} onGetValues={(values) => this.onFormSearch(values)}>
                </TheQueryForm>
                <TheTable
                    rowKey={"lotteryDrawRecordsId"}
                    scroll={{x: 'max-content', y: '63vh'}}
                    columns={columns}
                    dataSource={dataSource}
                />
                <ThePagination
                    pageNo={pageNo}
                    pageSize={pageSize}
                    total={total}
                    showQuickJumper={true}
                    pageSizeOptions={[10, 50, 100, 300, 500]}
                    pageChange={this.pageChange}
                />
            </div>
        );
    }
}

export default MergeRecord;
